<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <title>商品后台管理</title>
	<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
</head>
<body>
<nav class="navbar">
    <div class="container" style="height: 80px;background: #58a3f9">
        <!-- Brand and toggle get grouped for better mobile display -->
        <div class="navbar-header" >
            <a class="navbar-brand" href="#">
                <img src="image/easy-pay.png">
            </a>
        </div>
        <ul class="nav navbar-nav navbar-right" style="margin-top: 30px">
            <li><a href="#"><span class="inner">首页</span></a></li>
            <li >
                <a href="#" >
                    <span class="inner">商品管理</span></a>
            </li>
            <li>
                <a href="#" >
                    <span class="inner">购物车管理</span>
                </a>
            </li>

            <li>
                <a href="#" >
                    <span class="inner">用户管理</span></a>
            </li>
        </ul>

    </div><!-- /.container-fluid -->
</nav>
<div style="min-height: 400px">
   <div class="container">
       <div class="panel panel-default">
           <div class="panel-heading"><h4>商品管理-商品列表</h4></div>
           <div class="panel-body">
               <table class="table table-bordered">
                   <thead>
                     <tr>
                         <th style="width: 15%" class="text-center">商品编号</th>
                         <th style="width: 65%" class="text-center">商品标题</th>
                         <th style="width: 20%" class="text-center">编辑</th>
                     </tr>
                   </thead>
                   <tbody id="mytbody">                            
                     <!-- 在此处添加并修改结构代码，参考以下注释文档 -->
                     <!-- <tr>
                          <td class="text-center">1</td>
                          <td class="text-left">【全新版本6+128G】Huawei/华为 P30全面屏超感光徕卡三摄变焦双景录像980芯片智能手机p30</td>
                          <td class="text-center">
                              <button class="btn btn-primary btn-sm">详细</button>
                              <button class="btn btn-primary btn-sm">编辑</button>
                              <button class="btn btn-primary btn-sm">删除</button>
                          </td>
                      </tr> -->
                   </tbody>
               </table>
               <div>
                   <button class="btn btn-primary">添加商品</button>
               </div>
           </div>
       </div>
   </div>
</div>
<footer>
    <div class="container">
        <p class="text-center">易购集团</p>
        <p class="text-center">Copyright 2019</p>
    </div>
</footer>


<script type="text/javascript">
    $(document).ready(function() {
      list();
    });
    function list(){
        $.ajax({
            method: "POST",
            url: "http://ip:8080/h7/goods/list",
            contentType: "application/json;charset=utf-8",
            data:{},
            success:function (data) {
               console.log(data);
               var str = '';      
                for(var key in data.list) {
                  var deleteGoods = 'deleteGoods' + key;
                  str += '<tr><td class="text-center">' + data.list[key].id + '</td><td class="text-left">' 
                  + data.list[key].content 
                  + '</td><td class="text-center"><button class="btn btn-primary btn-sm">详细</button><button class="btn btn-primary btn-sm">编辑</button>'
                  + '<button class="btn btn-primary btn-sm" id="deleteGoods" onclick="deleteGoods('+ data.list[key].id+')">删除</button></td></tr>';
                }
                $("#mytbody").html(str);                           
            },
            error:function (message) {
                alert('错误');
            }
        });
    }
        
   
    
  </script>

</body>
</html>